import { Tabs, TabItem } from '@aws-amplify/ui-react';
import { ExampleCode } from '@/components/Example';
import { Fragment } from '@/components/Fragment';

<Fragment>
  {({}) => import(`./liveness-service-setup.mdx`)}
</Fragment>

### Step 2. Install dependencies

In Xcode, navigate to **File > Add Packages...**
Enter the **Amplify UI Swift Liveness** GitHub repo URL (`https://github.com/aws-amplify/amplify-ui-swift-liveness`) into the search bar and hit **Enter**. Wait for the result to load.

You'll see the **Amplify UI Swift Liveness** repository rules for which version of Liveness you want Swift Package Manager to install. Choose the dependency rule **Up to Next Major Version**, as it will use the latest compatible version of the dependency that can be detected in the repository. Then click **Add Package**.

Lastly, select the `FaceLiveness` product and click **Add Package**.

### Step 3. Initialize Amplify Auth

FaceLivenessDetectorView is a SwiftUI component that uses Amplify Auth to handle authorizing requests.
If you're not already using Amplify Auth in your application, follow the steps outlined [here](https://docs.amplify.aws/lib/auth/getting-started/q/platform/ios/).

### Step 4. Request camera permissions

FaceLivenessDetectorView requires access to the camera on the user's device in order to perform the Face Liveness check. Before displaying FaceLivenessDetectorView, prompt the user to grant camera permission. Please follow these guides for guidelines around requesting camera permission [iOS Human Interface Guidelines | Accessing private data](https://developer.apple.com/design/human-interface-guidelines/patterns/accessing-private-data/).

### Step 5. Add FaceLivenessDetectorView

```swift
import SwiftUI
import FaceLiveness

struct MyView: View { 
  @State private var isPresentingLiveness = true

  var body: some View { 
    FaceLivenessDetectorView(
      sessionID: <session ID>,
      region: <region>,
      isPresented: $isPresentingLiveness,
      onCompletion: { result in
        switch result {
        case .success: 
          // ...
        case .failure(let error):
          // ...
        default:
          // ...
        }
      }
    )
  }
}
```